<template>
  <el-container class="knowMan">
    <!-- 一级菜单下面所拥有的二级菜单 -->
    <SideMenu :lists="lists"></SideMenu>
    <!-- 以及二级菜单所对应的页面 -->
    <el-main>
      <nav-tab></nav-tab>
      <router-view></router-view>
    </el-main>
  </el-container>
</template>

<script>
import SideMenu from '../common/SideMenu.vue';
import NavTab from '@/components/common/NavTab.vue';

export default {
  components: {
    SideMenu, NavTab
  },
  data() {
    return {
      isCollapse: false,
      lists: [
        {
          title: '知识首页',
          children: [
            { index: 'homePage', title: '知识首页' },
          ]
        },
        {
          title: '知识发布',
          children: [
            { index: 'issue', title: '知识发布' },
            { index: 'audit', title: '知识发布审核' },
          ]
        },
        {
          title: '知识管理',
          children: [
            { index: 'tabLibrary', title: '标签库' },
            { index: 'category', title: '知识分类' },
          ]
        },
        {
          title: '知识发布考核',
          children: [
            { index: 'personIssue', title: '知识发布量统计'},
            { index: 'unitIssue', title: '单位发布量统计'},
          ]
        },
        {
          title: '知识应用',
          children: [
            { index: 'archive', title: '档案知识化' },
          ]
        }
      ]
    };
  }
};
</script>

<style lang="less" scoped>
.knowMan {
  height: 100%;
  color: #5d6880;
}
// 左侧导航栏
.el-menu {
  height: 100%;
}
.el-aside::-webkit-scrollbar {
  // 隐藏滚动条
  display: none;
}
.el-main::-webkit-scrollbar {
  // 隐藏滚动条
  display: none;
}

// 右侧页面主体
.el-main {
  padding: 0;
  // overflow: hidden;
  height: 100%; 
  display: flex;
  flex-direction: column;
  background-color: #f5f7fd;
  font-size: 14px;
}
</style>